{extend name="public/baseLayuimini"}
{block name="title"}
<title> 123</title>
{/block}
{block name="css"}

<style>

</style>
{/block}
{block name="main"}
<div class="header" style="display: flex;justify-content: space-between;">
    <div></div>
    <button class="layui-btn ayui-btn-normal">新增</button>
</div>
<div class="main">
    <table id="table" lay-filter="table"></table>
</div>
<div class="site-text" style="margin: 5%; display: none" id="window"  target="test123">
    <form class="layui-form" id="book" method="post" lay-filter="example">
        <div class="layui-form-item">
            <label class="layui-form-label">语言名称</label>
            <div class="layui-input-block">
                <input type="text" name="title" id="title" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">英文名称</label>
            <div class="layui-input-block">
                <input type="text" name="en_title" id="en_title" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">中文简称</label>
            <div class="layui-input-block">
                <input type="text" name="zh_short_title" id="zh_short_title" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">英文简称</label>
            <div class="layui-input-block">
                <input type="text" name="en_short_title" id="en_short_title" autocomplete="off" class="layui-input">
            </div>
        </div>
    </form>
</div>
<script type="text/html" id="tool">
    <a href="javascript:;" class="layui-btn layui-btn-sm" lay-event="edit">修改</a>
    <a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-danger" lay-event="del">删除</a>
</script>
{/block}
{block name="js"}
<script>
    layui.use(['table','layer','jquery'],function() {
        var table = layui.table, layer = layui.layer, $ = layui.jquery
        table.render({
            elem: '#table',
            url: '/admin/language',
            type: 'get',
            page: false,
            cols: [[ //表头
                {field: 'id', title: 'ID', width: 45, fixed: 'left'},
                {field: 'title', title: '中文名'},
                {field: 'en_title', title: '英文名'},
                {field: 'zh_short_title', title: '中简称'},
                {field: 'en_short_title', title: '英简称'},
                {title: '操作', width: 160, templet: "#tool"}
            ]]
        })
        table.on("tool(table)", function (obj) {
            var data = obj.data;
            var event = obj.event;
            if (event == "edit") {
                layer.open({
                    type:1,
                    title: ['编辑语言'],
                    btn: ['确定', '取消'],
                    content:$("#window"),  //弹窗路径
                    success:(layero,index)=>{
                        $($(layero)[0]).find('#title').val(data.title)
                        $($(layero)[0]).find('#en_title').val(data.en_title)
                        $($(layero)[0]).find('#zh_short_title').val(data.zh_short_title)
                        $($(layero)[0]).find('#en_short_title').val(data.en_short_title)
                    },yes:(index,layero)=>{
                        $.ajax({
                            url:'/admin/editLanguage',
                            type:'post',
                            data:{
                                title:$($(layero)[0]).find('#title').val(),
                                en_title:$($(layero)[0]).find('#en_title').val(),
                                zh_short_title:$($(layero)[0]).find('#zh_short_title').val(),
                                en_short_title:$($(layero)[0]).find('#en_short_title').val(),
                                id:data.id
                            },
                            success:res=>{
                                layer.msg(res ? '修改成功' : "修改失败")
                                layer.closeAll()
                                table.reload('table')
                            }
                        })
                    }
                })
            } else {
                layer.confirm('真的要删掉吗?', function () {
                    $.get('/admin/delLanguage', {id: data.id}, res => {
                        if (res) {
                            table.reload('table')
                            layer.msg('删除成功')
                        } else {
                            layer.msg('删除失败')
                        }
                    })
                }, function () {
                })
            }
        })
        $(".ayui-btn-normal").click(function(){
            layer.open({
                type:1,
                title: ['编辑语言'],
                btn: ['确定', '取消'],
                content:$("#window"),  //弹窗路径
                success:(layero,index)=>{

                },yes:(index,layero)=>{
                    $.ajax({
                        url:'/admin/editLanguage',
                        type:'post',
                        data:{
                            title:$($(layero)[0]).find('#title').val(),
                            en_title:$($(layero)[0]).find('#en_title').val(),
                            zh_short_title:$($(layero)[0]).find('#zh_short_title').val(),
                            en_short_title:$($(layero)[0]).find('#en_short_title').val(),
                        },
                        success:res=>{
                            layer.msg(res ? '修改成功' : "修改失败")
                            layer.closeAll()
                            table.reload('table')
                        }
                    })
                }
            })
        })
    })
</script>
{/block}